<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页</title>
</head>

<body>
    <main>
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide slide-1"></div>
                <div class="swiper-slide slide-2"></div>
                <div class="swiper-slide slide-3"></div>
            </div>
            <!-- 如果需要分页器 -->
            <div class="swiper-pagination"></div>
        </div>
        <div class="one">
            <div class="ranking">
                <p class="p1">今日排名</p>
                <p class="p2">9</p>
            </div>
            <div class="punch">
                <p class="p1">累积打卡<span>28</span>天</p>
                <div>今日打卡</div>
            </div>
        </div>
        <div class="two">
            <a class="moveData" href="./sport-data.html">
                <span>运动数据</span>
            </a>
            <div class="badge">
                <h5>累积运动徽章</h5>
                <p>
                    <span class="num">3</span>枚
                </p>
            </div>
        </div>
        <a class="three" href="./sport.html">
            <h5>课程训练</h5>
        </a>
        <div class="four">
            <h5>户外跑步</h5>
        </div>
    </main>
</body>

</html>